<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">

<title>Google Earth</title>

<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->


<script type="text/javascript" src="https://www.google.com/jsapi"></script>

<script type="text/javascript">
	var ge;
	google.load("earth", "1");

	function init() {
		google.earth.createInstance('map3d', initCB, failureCB);
	}

	function initCB(instance) {
		ge = instance;
		ge.getWindow().setVisibility(true);

		ge.getNavigationControl().setVisibility(ge.VISIBILITY_AUTO);
		ge.getLayerRoot().enableLayerById(ge.LAYER_BORDERS, true);
		ge.getLayerRoot().enableLayerById(ge.LAYER_ROADS, true);

		ge2.api.setGE(ge);
		//ge2.example.createExampleLineString();
		//ge2.example.createExamplePoint();
		
		ge2.example.createExample3D();
		
		ge2.example.setExampleViewLonLat();
		
		

		ge2.api.enableMove();

	}

	function failureCB(errorCode) {
	}

	google.setOnLoadCallback(init);
</script>

<script>
	var ge2 = {
		example : {
			defaultLat : 31,
			defaultLon : 32,
			setExampleViewLonLat : function() {
				ge2.api.setViewLonLat(ge2.example.defaultLon,
						ge2.example.defaultLat, 300);
			},
			createExampleLineString : function() {
				var ge = ge2.api.getGE();
				var line1 = ge2.api.getGE().createLineString('');
				line1.getCoordinates().pushLatLngAlt(48.740, -121.820, 0);
				line1.getCoordinates().pushLatLngAlt(48.800, -121.820, 0);
				line1.setTessellate(true);
				line1.setAltitudeMode(ge.ALTITUDE_CLAMP_TO_GROUND);

				var line2 = ge2.api.getGE().createLineString('');
				line2.getCoordinates().pushLatLngAlt(48.740, -121.800, 0);
				line2.getCoordinates().pushLatLngAlt(48.800, -121.800, 0);
				line2.setTessellate(true);
				line2.setAltitudeMode(ge.ALTITUDE_CLAMP_TO_GROUND);

				var multiGeometry = ge2.api.getGE().createMultiGeometry('');
				multiGeometry.getGeometries().appendChild(line1);
				multiGeometry.getGeometries().appendChild(line2);

				var multGeoPlacemark = ge2.api.getGE().createPlacemark('');
				multGeoPlacemark.setGeometry(multiGeometry);

				multGeoPlacemark.setStyleSelector(ge2.api.getGE().createStyle(
						''));
				var lineStyle = multGeoPlacemark.getStyleSelector()
						.getLineStyle();
				lineStyle.setWidth(10);
				lineStyle.getColor().set('ffff0000');

				ge2.api.getGE().getFeatures().appendChild(multGeoPlacemark);

				multGeoPlacemark.setName('Line Strings');
				multGeoPlacemark
						.setDescription('Two separate lineStrings, one description.');

			},
			createExamplePoint : function() {
				//Point
				var ge = ge2.api.getGE();
				var placemark = ge.createPlacemark('');
				var point = ge.createPoint('');
				point.setLatitude(ge2.example.defaultLat);
				point.setLongitude(ge2.example.defaultLon);
				placemark.setGeometry(point);
				placemark.setName('Drag Me!');
				ge.getFeatures().appendChild(placemark);
			},
			createExample3D : function() {
				var ge = ge2.api.getGE();
				var placemark = ge.createPlacemark('');
				placemark.setName('model');

				// Placemark/Model (geometry)
				var model = ge.createModel('');
				placemark.setGeometry(model);

				// Placemark/Model/Link
				var link = ge.createLink('');
				link
						.setHref('<%=basePath%>data3d/models/model.dae');
				model.setLink(link);

				// Placemark/Model/Location
				var loc = ge.createLocation('');
				loc.setLatitude(ge2.example.defaultLat);
				loc.setLongitude(ge2.example.defaultLon);
				model.setLocation(loc);
				console.log(loc);
				// add the model placemark to Earth
				ge.getFeatures().appendChild(placemark);
			},
			addExampleTiltLookAt : function() {
				ge2.api.addTiltLookAt(15);
			},
			addExampleTiltCamera : function() {
				ge2.api.addTiltCamera(15);
			},
			addExampleRollCamera : function() {
				ge2.api.addRollCamera(15);
			}
		},
		api : {
			getGE : function() {
				return ge2.api.variables.ge;
			},
			setGE : function(ge) {
				ge2.api.variables.ge = ge;
			},
			variables : {
				ge : null,
				dragInfo : null
			},
			setViewLonLat : function(lon, lat, range) {
				var lookAt = ge2.api.getGE().getView().copyAsLookAt(
						ge2.api.getGE().ALTITUDE_RELATIVE_TO_GROUND);

				// Set new latitude and longitude values.
				lookAt.setLatitude(lat);
				lookAt.setLongitude(lon);
				lookAt.setRange(range);

				// Update the view in Google Earth.
				ge2.api.getGE().getView().setAbstractView(lookAt);
			},
			addTiltLookAt : function(addValue) {
				var lookAt = ge2.api.getGE().getView().copyAsLookAt(
						ge2.api.getGE().ALTITUDE_RELATIVE_TO_GROUND);
				lookAt.setTilt(lookAt.getTilt() + addValue);
				// Update the view in Google Earth.
				ge2.api.getGE().getView().setAbstractView(lookAt);
			},
			addTiltCamera : function(addValue) {
				var ge = ge2.api.getGE();
				var camera = ge.getView().copyAsCamera(
						ge.ALTITUDE_RELATIVE_TO_GROUND);

				// Add 30 degrees to the current tilt
				// and 45 to the roll.
				camera.setTilt(camera.getTilt() + addValue);

				// Update the view in Google Earth.
				ge.getView().setAbstractView(camera);
			},
			addRollCamera : function(addValue) {
				var ge = ge2.api.getGE();
				var camera = ge.getView().copyAsCamera(
						ge.ALTITUDE_RELATIVE_TO_GROUND);
				camera.setRoll(camera.getRoll() + addValue);
				// Update the view in Google Earth.
				ge.getView().setAbstractView(camera);
			},
			enableMove : function() {
				// listen for mousedown on the window (look specifically for point placemarks)
				var ge = ge2.api.getGE();
				// Listen for mousedown on the window (look specifically for point placemarks).
				google.earth.addEventListener(ge.getWindow(), 'mousedown',
						function(event) {
							if (event.getTarget().getType() == 'KmlPlacemark'
									&& event.getTarget().getGeometry()
											.getType() == 'KmlPoint') {
								var placemark = event.getTarget();
								ge2.api.variables.dragInfo = {
									placemark : placemark,
									dragged : false
								};
							}
						});

				// Listen for mousemove on the globe.
				google.earth
						.addEventListener(
								ge.getGlobe(),
								'mousemove',
								function(event) {
									if (ge2.api.variables.dragInfo) {
										event.preventDefault();
										var point = ge2.api.variables.dragInfo.placemark
												.getGeometry();
										point.setLatitude(event.getLatitude());
										point
												.setLongitude(event
														.getLongitude());
										ge2.api.variables.dragInfo.dragged = true;
									}
								});

				// Listen for mouseup on the window.
				google.earth.addEventListener(ge.getWindow(), 'mouseup',
						function(event) {
							if (ge2.api.variables.dragInfo) {
								if (ge2.api.variables.dragInfo.dragged) {
									// If the placemark was dragged, prevent balloons from popping up.
									event.preventDefault();
								}

								ge2.api.variables.dragInfo = null;
							}
						});

			}

		}
	};
</script>



</head>

<body>
	<div id="map3d" style="height: 600px; width: 1000px;"></div>
	<div>
		<span><input type="button" value="增加倾斜(LookAt)"
			onclick="ge2.example.addExampleTiltLookAt()" /> </span><span><input
			type="button" value="增加倾斜(Camera)"
			onclick="ge2.example.addExampleTiltCamera()" /> </span><span><input
			type="button" value="增加滚动(Camera)"
			onclick="ge2.example.addExampleRollCamera()" /> </span>
	</div>
</body>
</html>
